<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>登录</title>
    <link rel="stylesheet" href="../../layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="../../CSS/media.css">
</head>
<style>
    body{
        overflow: hidden;
    }
.login_content{
    width: 400px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 15px;
}
.form{
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 15px;
}
.title{
    width: 100% !important;
    height: 35px;
    font-size: 24px !important;
    padding: 0 !important;
    text-align: left !important;
}
.layui-input-block{
    margin-left: 0 !important;
    margin-bottom: 20px;
}
.layui-input{
    border: 1px solid #c0bfbf !important;
}
.btn{
    width: 100% !important;
    height: 40px !important;
    line-height: 40px !important;
}
.layui-form-checked[lay-skin="primary"] i{
    border-color:  #00aeff !important;
    background-color: #00aeff !important;
}
.layui-form-checkbox[lay-skin="primary"] span{
    color: #1b1b1b !important;
}
.fr{
    float: right;
    margin-left: 25px;
    margin-top: 10px;
    color:#1b1b1b;
    font-size: 14px;
    cursor: pointer;
}
    .login_btn_r{
        position: absolute;
        right: 0px;
        top: 0px;
    }
</style>
<body>
    <div class="login_content">
        <div class="layui-form form" >
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <input type="text" name="account" required lay-verify="required" placeholder="账号"
                        autocomplete="off" class="layui-input user" />
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <input type="password" name="password" required lay-verify="required" placeholder="请输入您的密码"
                        autocomplete="off" class="layui-input pwd" />
                </div>
            </div>

            <div class="layui-form-item" style="margin-bottom:10px !important">
                <div class="layui-input-block" style="margin-bottom:0 !important">
                    <button class="layui-btn layui-btn-normal btn" lay-submit lay-filter="formDemo">登录</button>
                </div>
            </div>
            <div class="layui-form-item" style="margin-bottom:30px !important;position: relative;">
                <!-- <div class="layui-input-line"> -->
                <input type="checkbox" title="记住我" lay-skin="primary" checked>
                <!-- </div> -->
                <div class="login_btn_r">
                    <span class="fr">注册</span>
                    <span class="fr">忘记密码</span>
                </div>
            </div>
        </div>
    </div>
    <script src="../../JS/jquery-2.0.3.js"></script>
    <script src="../../layui/layui.js" charset="utf-8"></script>
    <script>
        var num = 0;
        $(function () {
            if(parent.getLocalStorage('JSXM') && parent.getLocalStorage('JSXM').userCount ){
                $('.user').val(parent.getLocalStorage('JSXM').userCount);
            }
            $('.btn').click(function () {
                var username = $('.user').val();
                var pwd = $('.pwd').val();
                //请求登录接口
                if(num ===3){
                    $.ajax({
                    type:'post',
                    url:parent.defaultUrl+'/lockUser',
                    data: JSON.stringify({
                        'userCount':username,
                        'userStatus':1
                    }),
                    dataType:'json',
                    contentType: 'application/json',
                    xhrFields: {withCredentials: true},
                    success:function (data) {
                        layer.msg(data.message)
                        }
                    })
                }else{
                    $('.btn').addClass('layui-btn-disabled').text('登录中...');
                    $.ajax({
                        type:'post',
                        url:parent.defaultUrl+'/login',
                        data: {
                            username:username,
                            password:pwd,
                            rememberMe:false
                        },
                        dataType:'json',
                        xhrFields: {withCredentials: true},
                        success:function (data) {
                            $('.btn').removeClass('layui-btn-disabled').text('登录');
                            if (data.code === 200) {

                                //向本地缓存登录数据
                                //判断用户头像是否为null
                                data.data.userPhoto = data.data.userPhoto ? data.data.userPhoto : parent.u_init_icon;
                                parent.setLocalStorage('JSXM',data.data);
                                parent.layer.msg('登录成功');
                                parent.location.reload();

                            } else if(data.code === 302) {
                                num++;
                                layer.msg(data.message)
                            }
                        }
                    })
                }
                
            })
        })
        // 回车键触发登录
        $('body').keyup(function(e){
            if(e.keyCode===13){
                $('.btn').click()
            }
        })
        layui.use("form", function () {
            var form = layui.form
        });
    </script>
</body>

</html>